<template>
  <a-modal
    destroyOnClose
    :title="title"
    :width="1400"
    :visible="visible"
    @cancel="handleCancel"
    :footer="null"
    cancelText="关闭"
  >
    <a-form-model ref="form" :model="model" :rules="validatorRules">
      <a-collapse v-model="activeKey">
        <a-collapse-panel key="1" header="基本信息">
          <a-row :gutter="48">
            <a-col :span="8" :hidden="true">
              <a-form-model-item label="标题" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="bpmBizTitle">
                <a-input v-model="model.bpmBizTitle" placeholder="请输入标题" ></a-input>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="单据编号" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="purchaseBill">
                <a-input v-model="model.purchaseBill" placeholder="请输入单据编号" disabled></a-input>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="申请人" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="proposer">
                <select-user-by-dep
                  placeholder="请选择申请人"
                  v-model="model.proposer"
                  disabled/>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="申请部门" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="departId">
                <j-select-depart placeholder="请选择申请部门" v-model="model.departId" disabled/>
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="申请时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="createTime">
                <j-date
                  placeholder="请选择申请时间"
                  v-model="model.createTime"
                  :show-time="true"
                  date-format="YYYY-MM-DD HH:mm:ss"
                  style="width: 100%"
                  disabled/>
              </a-form-model-item>
            </a-col>
            <!-- <a-col :span="8">
              <a-form-model-item label="工期(供货期)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="supplyTime">
                <j-date
                  disabled
                  placeholder="请选择工期"
                  v-model="model.supplyTime"
                  date-format="YYYY-MM-DD"
                  style="width: 100%"
                />
              </a-form-model-item>
            </a-col> -->
            <a-col :span="8">
              <a-form-model-item label="开标时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="calibrationTime">
                <j-date
                  date-format="YYYY-MM-DD HH:mm"
                  disabled
                  placeholder="请选择开标时间"
                  :show-time="true"
                  v-model="model.calibrationTime"
                  style="width: 100%" />
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
              <a-form-model-item label="预算价(元)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="budget">
                <a-input-number
                  disabled
                  :max="99999999"
                  :min="0"
                  :precision="2"
                  v-model="model.budget"
                  placeholder="请输入预算价"
                  style="width: 100%" />
              </a-form-model-item>
            </a-col>
            <a-col :span="8">
                <a-form-model-item label="中标总价(元)" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="totalBidPrice">
                  <a-input-number
                    disabled
                    :max="99999999"
                    :min="0"
                    :precision="2"
                    v-model="model.totalBidPrice"
                    placeholder="请输入中标总价"
                    style="width: 100%" />
                </a-form-model-item>
              </a-col>
            <!-- <a-col :span="8">
              <a-form-model-item label="开票方式" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="invoiceManner">
                <a-input disabled v-model="model.invoiceManner" placeholder="请输入开票方式" ></a-input>
              </a-form-model-item>
            </a-col> -->
            <a-col :span="8">
              <a-form-model-item label="所属团队" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="teamId">
                <select-team-input disabled placeholder="请选择所属团队" v-model="model.teamId" :tdlx="3"/>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-collapse-panel>
        <a-collapse-panel key="2">
          <div slot="header">
            <span>招标采购申请信息</span>
            <span style="color: red; font-size: 12px;">（注：只可关联一个招标采购申请）</span>
          </div>
          <a-row :gutter="48">
            <a-col :span="24">
              <a-table
                ref="table"
                size="middle"
                :scroll="{x:true}"
                bordered
                rowKey="key"
                :columns="defColumns1"
                :dataSource="dataSource1"
                :pagination="false"
                class="j-table-force-nowrap"
              >
                <template slot="invitationId" slot-scope="text,record">
                  <a @click.prevent="onDetail(record)">
                    {{findInvitationId(record.invitationId)}}
                  </a>
                </template>
              </a-table>
            </a-col>
          </a-row>
        </a-collapse-panel>
        <a-collapse-panel key="3" header="中标信息">
          <a-row :gutter="48">
            <a-col :span="24">
              <a-table
                ref="table"
                size="middle"
                :scroll="{x:true}"
                bordered
                rowKey="key"
                :columns="defColumns2"
                :dataSource="dataSource2"
                :pagination="false"
                class="j-table-force-nowrap"
              >
              </a-table>
            </a-col>
          </a-row>
          <a-row :gutter="48">
            <a-col :span="24">
              <a-form-model-item label="各厂家报价、谈判情况描述及选定该厂家供货的原因：（重点描述品牌、价格对比情况、原厂还是代理商等）" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="quoteDescription">
                <a-textarea disabled
                  :max-length="500"
                  v-model="model.quoteDescription"
                  rows="10"
                  maxlength="5000"
                  placeholder="重点描述品牌、价格对比情况、是原厂还是代理商等"/>
              </a-form-model-item>
            </a-col>
            <a-col :span="24">
              <a-form-model-item label="历史采购情况说明：  （重点描述品牌、价格情况）" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="historyDescription">
                <a-textarea
                  disabled
                  :max-length="500"
                  v-model="model.historyDescription"
                  rows="10"
                  maxlength="1000"
                  placeholder="重点描述品牌、价格情况"/>
              </a-form-model-item>
            </a-col>
            <a-col :span="24">
              <a-form-model-item label="与采购申请的差异：  （重点描述规格型号、参数及品牌、数量等更改项目）" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="differenceDescription">
                <a-textarea
                  disabled
                  :max-length="500"
                  v-model="model.differenceDescription"
                  rows="10"
                  maxlength="1000"
                  placeholder="重点描述规格型号、参数及品牌、数量等更改项目"/>
              </a-form-model-item>
            </a-col>
            <a-col :span="24">
              <a-form-model-item label="申购单位意见：  （对产品品牌、价格、数量的认可及增减等描述）" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="opinionDescription">
                <a-textarea
                  disabled
                  :max-length="500"
                  v-model="model.opinionDescription"
                  rows="10"
                  maxlength="1000"
                  placeholder="对产品品牌、价格、数量的认可及增减等描述"/>
              </a-form-model-item>
            </a-col>
            <a-col :span="24">
              <a-form-model-item label="备注" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="remark">
                <a-textarea disabled :max-length="500" v-model="model.remark" rows="4" placeholder="请输入备注"/>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-collapse-panel>
        <a-collapse-panel key="4" header="附件信息（1、询比价对比表；2、中标厂家盖章报价单；3、其它）">
          <a-row :gutter="48">
            <a-col :span="24">
              <a-form-model-item prop="purchaseFile">
                <a-button icon="download" @click="viewFile(model.purchaseFile)">文件列表</a-button>
              </a-form-model-item>
            </a-col>
          </a-row>
        </a-collapse-panel>
      </a-collapse>
    </a-form-model>
    <erp-project-report-modal  ref="projectForm"></erp-project-report-modal>
    <view-file-modal ref="viewFileModal"></view-file-modal>
    <!-- 招标采购申请单据详情开始 -->
    <a-modal
      :maskClosable="false"
      title="招标采购申请单据详情"
      :width="1350"
      :bodyStyle="{
        padding: '0 24px'
      }"
      :visible="visibleDetail"
      @cancel="handleCancelDetail"
      cancelText="关闭">
        <erp-purchase-apply-invitation-form ref="realForm" :disabled="true" normal></erp-purchase-apply-invitation-form>
      <template slot="footer">
        <a-button @click.stop="handleCancelDetail">关闭</a-button>
      </template>
    </a-modal>
    <!-- 招标采购申请单据详情结束 -->
    <SelectPurchaseCalibrationOpinionDetailModal ref="opinionInputModal"></SelectPurchaseCalibrationOpinionDetailModal>
  </a-modal>
</template>

<script>
import { getAction } from '@/api/manage'
import { viewFile } from '@/utils/util'
import ViewFileModal from '@/views/scy/components/ViewFileModal'
import SelectUserByDep from '@/views/scy/components/SelectUserByDep'
import SelectTeamInput from '@/views/scy/components/SelectTeamInput'
import SelectProjectInput from '@/views/scy/components/SelectProjectInput'
import ErpProjectReportModal from '@/views/erp/report/project/modules/ErpProjectReportModal'
import { filterMultiDictText, initDictOptions } from '@/components/dict/JDictSelectUtil'
import ErpPurchaseApplyInvitationForm from '@/views/erp/purchase/procurement/modules/ErpPurchaseApplyInvitationForm'
import SelectPurchaseCalibrationOpinionDetailModal from '@/views/erp/purchase/procurement/modules/SelectPurchaseCalibrationOpinionDetailModal'
export default {
  components: {
    SelectUserByDep,
    ViewFileModal,
    SelectTeamInput,
    SelectProjectInput,
    ErpProjectReportModal,
    ErpPurchaseApplyInvitationForm,
    SelectPurchaseCalibrationOpinionDetailModal
  },
  name: 'ErpRevokedDocFormCalibrationDetail',
  mixins: [viewFile],
  data() {
    return {
      title:"定标结果确认单据详情",
      visibleDetail: false,
      visible:false,
      activeKey: ['1', '2', '3','4'],
      model: {},
      labelCol: {
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 24 }
      },
      validatorRules: {
        supplyTime: [
          { required: true, message: '请选择工期(供货期)!', trigger: 'change' }
        ],
        calibrationTime: [
          { required: true, message: '请选择开标时间!', trigger: 'change' }
        ],
        budget: [
          { required: true, message: '请输入预算价!', trigger: 'blur' },
          { pattern: /^([0-9]*[1-9][0-9]*(\.[0-9]+)?|[0]+\.[0-9]*[1-9][0-9]*)$/, message: '请输入大于0的数字!' },
        ],
        invoiceManner: [
          { required: true, message: '请选择开票方式!', trigger: 'blur' }
        ],
        quoteDescription: [
          { required: true, message: '请输入描述!', trigger: 'blur' }
        ],
        differenceDescription: [
          { required: true, message: '请输入描述', trigger: 'blur' }
        ],
        opinionDescription: [
          { required: true, message: '请输入描述', trigger: 'blur' }
        ],
        teamId: [
          { required: true, message: '请选择所属团队!', trigger: 'change' }
        ],
      },
      defColumns1: [
        {
          title: '序号',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: function (t, r, index) {
            return parseInt(index) + 1;
          }
        },
        {
          title: '关联招标采购申请',
          align: 'center',
          dataIndex: 'invitationId',
          scopedSlots: { customRender: 'invitationId' },
        },
        {
          title:'项目名称',
          align:"center",
          dataIndex: 'projectId',
          customRender: (text,r) => {
            if (!text) {
              return ''
            } else {
              return <a v-on:click={(e) => this.onDetails(text)}>{ filterMultiDictText(this.dictOptions['projectId'], text + '') }</a>;
            }
          }
        },
        {
          title: '团队名称',
          align: 'center',
          dataIndex: 'teamId',
          customRender: (text) => {
            if (!text) {
              return ''
            } else {
              return filterMultiDictText(this.dictOptions['teamId'], text + '')
            }
          }
        },
        {
          title: '定标意见单',
          align: 'center',
          dataIndex: 'opinionId',
          customRender: (text,r) => {
              if (!text) {
                return ''
              } else {
                return <a v-on:click={(e) => this.onOpinionDetails(text)}>{ filterMultiDictText(this.dictOptions['opinionId'], text + '') }</a>;
              }
            }
        },
      ],
      defColumns2: [
        {
          title: '序号',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: function (t, r, index) {
            return parseInt(index) + 1;
          }
        },
        {
          title: '中标单位',
          align: 'center',
          dataIndex: 'biddingUnit',
          width: 200,
            ellipsis: true,
          customRender: (text) => {
            if (!text) {
              return ''
            } else {
              return filterMultiDictText(this.dictOptions['biddingUnit'], text + '')
            }
          }
        },
        {
          title: '中标价(元)',
          align: 'center',
          width: 100,
            ellipsis: true,
          dataIndex: 'bidding'
        },
        {
          title: '付款方式',
          width: 200,
            ellipsis: true,
          align: 'center',
          dataIndex: 'payType'
        },
        {
          title: '税率(%)',
          align: 'center',
          width: 100,
          ellipsis: true,
          dataIndex: 'taxRate'
        },
        {
          title: '发票类型',
          align: 'center',
          width: 100,
            ellipsis: true,
          dataIndex: 'invoiceCategory',
          customRender: (text) => {
            if (!text) {
              return ''
            } else {
              return filterMultiDictText(this.dictOptions['invoiceCategory'], text + '')
            }
          }
        },
        {
            title: '工期(供货期)',
            align: 'center',
            width: 100,
            ellipsis: true,
            dataIndex: 'duration'
          },
          {
            title: '是否垫资',
            align: 'center',
            width: 100,
            ellipsis: true,
            dataIndex: 'isAdvancePayment',
            customRender: (text) => {
              if (!text) {
                return ''
              } else {
                return filterMultiDictText(this.dictOptions['isAdvancePayment'], text + '')
              }
            }
          }
      ],
      dataSource1: [],
      dataSource2: [],
      showBusinessSegment: false,
      dictOptions: {},
      url: {
        queryById: '/api/erp/purchase/procurement/erpPurchaseApplyInvitation/queryById'
      }
    }
  },
  methods: {
    onOpinionDetails (id) {
      this.$refs.opinionInputModal.visible = true
      this.$nextTick(() => {
        this.$refs.opinionInputModal.loadData(id)
      })
      
    },
    findInvitationId(text) {
      if (!text) {
        return ''
      } else {
        return filterMultiDictText(this.dictOptions['invitationId'], text + '')
      }
    },
    onDetail(data) {
      this.visibleDetail = true
      this.$nextTick(()=>{
        const id = data.invitationId;
        getAction(this.url.queryById, { id }).then((res) => {
          if (res.success) {
            const model = res.result
            this.$refs.realForm.edit(model);
          }
        })
      });
    },
    handleCancelDetail() {
      this.visibleDetail = false
    },
    handleCancel() {
      this.visible = false;
    },
    async initDictConfig() {
      //中标单位
      initDictOptions('erp_purchase_supplier,enterprise_name,id').then((res) => {
        if (res.success) {
          this.$set(this.dictOptions, 'biddingUnit', res.result)
        }
      })
      //发票类型
      initDictOptions('invoice_type').then((res) => {
        if (res.success) {
          this.$set(this.dictOptions, 'invoiceCategory', res.result)
        }
      })
      // 项目名称
      initDictOptions('erp_omc_project,project_name,id').then((res) => {
        if (res.success) {
          this.$set(this.dictOptions, 'projectId', res.result)
        }
      })
      //团队名称
      initDictOptions('erp_omc_team_manager,alias_name,id').then((res) => {
        if (res.success) {
          this.$set(this.dictOptions, 'teamId', res.result)
        }
      })
      //关联招标采购申请
      initDictOptions('erp_purchase_apply_invitation,purchase_bill,id').then((res) => {
        if (res.success) {
          this.$set(this.dictOptions, 'invitationId', res.result)
        }
      })
      //关联定标意见单
        initDictOptions('erp_purchase_calibration_opinion,purchase_bill,id').then((res) => {
          if (res.success) {
            this.$set(this.dictOptions, 'opinionId', res.result)
          }
        })
      // 是否垫资
      initDictOptions('yes_no').then((res) => {
        if (res.success) {
          this.$set(this.dictOptions, 'isAdvancePayment', res.result)
        }
      })
    },
    edit (record) {
      this.visible = true
      this.initDictConfig()
      this.model = Object.assign({},record)
      if(!!this.model.provisionBroad&&this.model.provisionBroad=='1535176942946377729'){
        // 选择的是行政类
        this.showBusinessSegment = false;
      }else{
        // 选择的不是行政类
        this.showBusinessSegment = true;
      }
      this.childLoadData1(this.model.id)
      this.childLoadData2(this.model.id)
    },
    onDetails(id) {
      const that = this
      this.$nextTick(() => {
        getAction('/api/erp/project/report/erpProjectReport/queryById', { id: id }).then((res) => {
          if (res.success) {
            const model = res.result
            that.$refs.projectForm.getDetail(model);
            that.$refs.projectForm.title = '项目一览表';
          }
        })
      })
    },
    childLoadData1(id) {
      const params = {
        billId: id,
        column: 'createTime',
        order: 'desc',
        pageNo: 1,
        pageSize: 10
      }
      getAction('/api/erp/purchase/procurement/erpPurchaseCalibrationDetail/allList', params).then(res => {
        if (res.success) {
          this.dataSource1 = res.result.records || res.result
          this.dataSource1.forEach((item, index) => {
            item.key = index
          })
        }
        if (res.code === 510) {
          this.$message.warning(res.message)
        }
      })
    },
    childLoadData2(id) {
      const params = {
        billId: id,
        column: 'createTime',
        order: 'desc',
        pageNo: 1,
        pageSize: 10
      }
      getAction('/api/erp/purchase/procurement/erpPurchaseCalibrationUnit/allList', params).then(res => {
        if (res.success) {
          this.dataSource2 = res.result.records || res.result
          this.dataSource2.forEach((item, index) => {
            item.key = index
          })
        }
        if (res.code === 510) {
          this.$message.warning(res.message)
        }
      })
    },
  }
}
</script>
<style scoped>

</style>